// PdfViewer.tsx
import React from 'react';
import { Card, Button } from 'antd';
import { FileOutlined } from '@ant-design/icons';
import { useState } from 'react';

interface PdfViewerState {
  pdfUrl: string;
}

function usePdfViewer(pdfUrl: string) {
  const [state, setState] = useState<PdfViewerState>({ pdfUrl });

  const handleDownload = () => {
    const a = document.createElement('a');
    a.href = state.pdfUrl;
    a.download = 'document.pdf'; // 设置下载文件的默认名称
    document.body.appendChild(a);
    a.click();
    document.body.removeChild(a);
  };

  return { ...state, handleDownload };
}

interface PdfViewerProps {
  pdfUrl: string;
}

const PdfViewer: React.FC<PdfViewerProps> = ({ pdfUrl }) => {
  const { handleDownload } = usePdfViewer(pdfUrl);

  return (
    <Card style={{ width: '100%', maxWidth: 800, margin: 'auto' }}>
      <iframe
        src={pdfUrl}
        style={{ width: '100%', height: 500 }}
        frameBorder="0"
      />
      <div style={{ textAlign: 'center', marginTop: 10 }}>
        <Button type="primary" onClick={handleDownload} icon={<FileOutlined />}>
          下载
        </Button>
      </div>
    </Card>
  );
};

export default PdfViewer;